import styled from 'styled-components'


  export const  HomeCityWrap=styled.div`
             height:100%;
             font-size:.14rem;
             color:#000;
             .main{
                 height:100%;
             .nav1{
              width:100%;
              ul{ 
                 white-space: nowrap;
                  width:100%; 
                  overflow-x:scroll;
                  padding-left:.16rem;
                  border-bottom:2px solid #F7F7F7;
              li{              
                  display: inline-block;                          
                  margin:0 .25rem 0 0;
                  height:.368rem;
                  line-height:.368rem;   
                  &.show{
                      color:#1890ff;
                      border-bottom:2px solid #1890ff;
                  }           
              }
                  
              }
              ol{
                  white-space: nowrap;
                  width:100%; 
                  overflow-x:scroll;
                  padding:.09rem .12rem;
                 
                  li{              
                  display: inline-block;                          
                  margin:0 .12rem 0 0;
                  height:.276rem;
                  line-height:.276rem;  
                  padding:0 .05rem;
                    font-size: 13px;
                    background: #f6f6f7;
                    border-radius: 2px;
                    border: 1px solid #fff;       
              }
              }
          } 
          .citylist{
              height:100%;
              overflow:hidden;
            ol{
                  li{
                  display: flex;
                  flex-direction:row; 
                  height:1.47rem;
                  padding:.12rem 0 0 .12rem;
                  div:first-child{
                      padding-right:.1rem;
                      position: relative;
                      img{
                          height:.96rem;
                          width:.96rem;
                          border-radius:.05rem;
                      }
                      .icon-top{   
                          position: absolute;                     
                          top:0;
                          left:0;
                          background:#2dbb55;
                          color:white;
                          font-size:.1rem;
                      }
                      .icon-foot{
                        position: absolute;                     
                          bottom:.4rem;
                          left:.28rem;  
                          font-size:.11rem;
                          color:white;
                      }
                  } 
                  div:last-child{
                      p{
                          font-size:.14rem;
                          color:#333;
                      }
                      .ad{                        
                          font-size:.1rem;
                          color:#1890ff;
                          overflow:hidden;
                          span{
                              border:1px solid #1890ff;
                              margin-right:.05rem;
                              border-radius: .13rem;
                          }                             
                      }
                      .time{
                          font-size:.12rem;
                          color:#666;
                          span{
                              margin-right:.05rem;
                          }
                      }
                      .price{
                          display: flex;
                          flex-direction:row;
                          justify-content:space-between;
                          font-size:.1rem;
                          padding-right:.2rem;
                          align-items:center;
                          border-bottom:1px solid #F7F7F7;
                          div:first-child{
                              color:#ff7733;
                              span{
                                  font-size:.2rem;
                              }
                          }
                          div:last-child{
                              color:#999;
                          }
                      }
                  }
                  }
                
              }
          }
          }
  
  `